<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script src="echarts.js"></script>
</head>
<body>
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 600px;height:400px;"></div>
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));

        // 指定图表的配置项和数据
        option = {
            title : {
                text: '58同城招聘数据',
                subtext: '岗位分布',
                x:'center'
            },
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                left: 'left',
                data: [' 普工', ' 销售代表', ' 操作工', ' 电话销售', ' 快递员', ' 送餐员', ' 电话客服', ' 房产经纪人', '销售代表', ' 服务员', '其他']
            },
            series : [
                {
                    name: '岗位',
                    type: 'pie',
                    radius : '55%',
                    center: ['50%', '60%'],
                    data:[
                        {name:" 普工", value:5781},
                        {name:" 销售代表", value:436},
                        {name:" 操作工", value:304},
                        {name:" 电话销售", value:256},
                        {name:" 快递员", value:220},
                        {name:" 送餐员", value:202},
                        {name:" 电话客服", value:167},
                        {name:" 房产经纪人", value:143},
                        {name:"销售代表", value:142},
                        {name:" 服务员", value:129},
                        {name:"其他", value:2396}
                    ],
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };


        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    </script>
</body>
</html>